<template>
	<view class="page-container" @touchmove.prevent>
		<view class="user-info" @click="toedituser">
			<image class="user-avatar" :src="user.nicPic.url"></image>
			<view class="user-details">
				<text class="user-name">{{ user.nicName || user.userId }}</text>
				<text class="user-wechat-id">邻里ID：{{ user.userId }}</text>
			</view>
			<uni-icons type="arrowright" size="20" class="user-arrow"></uni-icons>
		</view>

		<!-- 功能列表 -->
		<view class="function-list">
			<view class="function-item">
				<uni-icons class="item-icon" type="notification" size="30" color="#ffaa00"></uni-icons>
				<text class="item-text">通知消息</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>

			<view class="function-item" @click.stop="toContactPage">
				<uni-icons class="item-icon" type="wallet" size="30" color="#aa5500"></uni-icons>
				<text class="item-text">通讯录</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>
			<view class="function-item" @click="handleSeting">
				<uni-icons class="item-icon" type="gear" size="30" color="#555500"></uni-icons>
				<text class="item-text">通用设置</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>
			<view class="function-item" @click="orderList">
				<uni-icons class="item-icon" type="cart" size="30" color="#00aaff"></uni-icons>
				<text class="item-text">订单列表</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>
			<view class="function-item" @click="shop">
				<uni-icons class="item-icon" type="shop" size="30" color="#00aa00"></uni-icons>
				<text class="item-text">我的商铺</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>
			<view class="function-item" @click="linler" v-if="isOwn">
				<uni-icons class="item-icon" type="staff-filled" size="30" color="#55aaff"></uni-icons>
				<text class="item-text">管家服务</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>

			<view class="function-item">
				<uni-icons class="item-icon" type="gift" size="30" color="#999"></uni-icons>
				<text class="item-text">账户管理</text>
				<uni-icons type="arrowright" size="20"></uni-icons>
			</view>

			<view v-for="(group, index) in groups" :key="index" class="function-item" @click="toGroupAdmin(group.groupId)">
				<view class="admin-menu">
					<view class=""><uni-icons type="staff" size="30"></uni-icons></view>
					<view class="">
						<text class="item-text">社区管理({{ group.groupName }})</text>
					</view>
					<view class=""><uni-icons type="arrowright" size="20"></uni-icons></view>
				</view>
			</view>
		</view>
		<view class="about-me">
			<view>关于邻里</view>
			<view @click="yinshi">邻里隐私政策</view>
			<view class="copyright" >
			<text @click="urlBeian">copyright 2025 福建便利宝电子有限公司 版权所有;闽ICP备14017838号-7A</text>
			</view>
			<view class="copyright" @click="fuwuxueyi">Operation 2025 福建清市惠农电子商有限公司 运营管理</view>
		</view>
	</view>
</template>

<script>
import seting from '../pages/seting/seting.vue';
const linlier=uniCloud.importObject('linlier',{customUI:true})
export default {
	name: 'leftBtn',
	comments: {
		seting
	},
	data() {
		return {
			
			groups: [],
			count: 0,
			linlierInfo:{},
			hasLinlier:false
			// 可以在这里定义数据
		};
	},
	computed: {
		user() {
			return this.$store.state.msg.user;
		},
		isOwn(){
			return this.user.userId===this.linlierInfo
		}
		
	
	},
	mounted() {
		this.getLinlier()
	},

	methods: {
		urlBeian(){
			plus.runtime.openURL(
				'https://beian.miit.gov.cn/#/Integrated/index'
			)
		},
	async	getLinlier(){
			const res=await linlier.hasLinlier(this.$store.state.msg.location)
			console.log(res);
			if(res.success){
				this.linlierInfo=res.data
				this.haslinlier=true
			}else{
				this.hasLinlier=false
				this.linlierInfo={}
			}
			
			
		},
		fuwuxueyi() {
			// this.count++;
			// if (this.count === 7) {
			// 	getApp().globalData.debugShow = true;
			// } else {
			// 	getApp().globalData.debugShow = false;
			
			// }
			uni.navigateTo({
				url:'/pages/fuwuxueyi/fuwuxueyi'
			})
			
		},

		onAddClick() {
			// 处理添加按钮点击事件
			console.log('点击了添加按钮');
		},
		onFunctionClick(item) {
			// 处理功能项点击事件
			console.log(`点击了 ${item}`);
		},
		toGroupAdmin(groupId) {
			uni.navigateTo({
				url: `/own/ownAdmin/ownAdmin?groupId=${groupId}`
			});
		},
		toedituser() {
			uni.navigateTo({
				url: '/pages/aboutMe/aboutMe'
			});
		},
		handleSeting() {
			uni.navigateTo({
				url: '/pages/seting/seting'
			});
		},
		toContactPage() {
			uni.navigateTo({
				url: '/pages/contactPage/contactPage'
			});
		},
		linler(){
			uni.navigateTo({
				url:'/own/ownAdmin/ownAdmin'
			})
		},
		shop(){
			uni.navigateTo({
				url:'/pages/shop/shop'
			})
		},
		orderList(){
			uni.navigateTo({
				url:'/pages/orderList/orderList'
			})
		},
		yinshi(){
			uni.navigateTo({
				url:'/pages/yinshixueyi/yinshixueyi'
			})
		}
		
	}
};
</script>

<style lang="scss" scoped>
.page-container {
	position: fixed;
	z-index: 200;
	background-color: #f5f5f5;
	height: 100vh;
	width: 80vw;
	display: flex;
	flex-direction: column;
}
.admin-menu {
	display: flex;

	align-items: center;
	justify-content: space-evenly;
}

.user-info {
	background-color: #fff;
	display: flex;
	align-items: center;
	padding: 25rpx;
	padding-top: 200rpx;
	color: #fff;
	background-color: #4a95df;
	.user-avatar {
		width: 60px;
		height: 60px;
		border-radius: 10%;
		margin-right: 20px;
	}

	.user-details {
		display: flex;
		flex-direction: column;
		flex: 1;

		.user-name {
			font-size: 24px;
			font-weight: bold;
		}

		.user-wechat-id {
			font-size: 14px;
			color: #fff;
		}
	}

	.user-arrow {
		color: #fff;
	}
}

.function-list {
	background-color: #fff;
	margin-top: 10px;
	flex: 1; /* 让功能列表占据中间所有剩余空间 */
	overflow-y: auto; /* 当功能项过多时，允许滚动，避免撑开底部区域 */

	.function-item {
		display: flex;
		align-items: center;
		height: 90rpx; /* 增加高度，提升点击区域 */
		gap: 50rpx;
		padding: 0 25rpx;
		transition: background-color 0.2s; /* 点击过渡效果 */

		&:active {
			background-color: #f8f8f8; /* 点击态背景，更柔和 */
		}

		.item-icon {
			margin-right: 20rpx;
			/* 不同功能使用不同颜色，提升区分度 */
		}

		.item-text {
			flex: 1;
			font-size: 32rpx;
			color: #333;
		}

		.item-arrow {
			color: #ccc;
		}
	}
}
.about-me {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 25rpx 20rpx;
	background-color: #f5f5f5;
	gap: 20rpx; /* 统一间距 */
	margin-top: auto; /* 固定在底部 */

	.about-item {
		font-size: 26rpx;
		color: #55aaff;
		padding: 8rpx 15rpx;
		border-radius: 8rpx;
		transition: background-color 0.2s;

		&:active {
			background-color: rgba(85, 170, 255, 0.1); /* 点击态背景 */
		}
	}

	.copyright {
		text-align: center;
		font-size: 20rpx;
		color: #999;
		line-height: 32rpx; /* 增加行高，提升可读性 */
		padding: 0 10rpx;
	}
}
</style>
